<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>综合服务系统--试题库修改</title>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/supplier/common/css/style.css"/>
    <!--Layui-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--extended-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/extended.css"/>
    <link rel="stylesheet" href="/plugin/it/common/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <!--公用样式JS-->
    <script type="text/javascript" src="${re.contextPath}/plugin/jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/comment.js"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/zTree/js/jquery.ztree.all.js" charset="utf-8"></script>
</head>
<style>
    .Right {
        width: 100%;
        overflow-y: auto;
    }
    .screening ul li:nth-child(1) select, .screening ul li:nth-child(3) select, .screening ul li:nth-child(6) select {
        width: 30%;
    }

    .layui-laypage .layui-laypage-curr .layui-laypage-em {
        background: #5775EF;
    }

    .layui-form-radio > i:hover, .layui-form-radioed > i {
        color: #5775EF;
    }

    .layui-form-radio {
        margin: 0;
        padding: 0;
    }
</style>

<body>
<!--头部-->

<!--容器-->
<div class="container clearfix">
    <!--右侧内容-->
    <div class="Right fr">
        <form class="layui-form" enctype="multipart/form-data">
            <div class="screening screeningOne whitebg clearfix" style="margin-top: 20px;">
                <input type="hidden" name="quId" id="quId" value="${eq.quId}">
                <div class="bold">试题设置</div>
                <ul class="clearfix fl"  style="width: 100%;">
                    <li style="width: 30%;">
                        <label class="fl"><span class="red">*</span>试题分类：</label>
                        <select name="quCategory" class="ml8 " id="quCategory" disabled="disabled" lay-verify="required"  style="width: 55%;
                                padding: 0 0 0 3;"
                                lay-ignore>
                            <option value="">请选择</option>
                            <#list stfl as vo>
                                <option value="${vo.badtCode}"
                                        <#if (eq.quCategory)??>
                                            <#if (eq.quCategory) ==(vo.badtCode)>
                                                selected=selected
                                            </#if>
                                        </#if>
                                >${vo.badtName}
                                </option>
                            </#list>
                        </select>
                    </li>
                    <li style="width: 30%;margin-left: 5%;">
                        <label class="fl"><span class="red">*</span> 试题类型：</label>
                        <select name="quType" class="ml8 " disabled="disabled" style="width: 55%;padding: 0 0 0 3;" id="quType" lay-verify="required"
                                lay-ignore>
                            <#list sttx as vo>
                                <option value="${vo.badtCode}"
                                        <#if (eq.quType)??>
                                            <#if (eq.quType) ==(vo.badtCode)>
                                                selected=selected
                                            </#if>
                                        </#if>
                                >${vo.badtName}
                                </option>
                            </#list>
                        </select>
                    </li>
                    <li style="width: 30%;margin-left: 5%;">
                        <label class="fl"><span class="red">*</span> 试题难度：</label>
                        <select name="level" class="ml8 "  style="width: 55%;padding: 0 0 0 3;"  disabled="disabled" id="level" lay-verify="required"
                                lay-ignore>
                            <option value="">请选择</option>
                            <#list stnd as vo>
                                <option value="${vo.badtCode}"
                                        <#if (eq.level)??>
                                            <#if (eq.level) ==(vo.badtCode)>
                                                selected=selected
                                            </#if>
                                        </#if>
                                >${vo.badtName}
                                </option>
                            </#list>
                        </select>
                    </li>
                </ul>
                <div class="bold">题目名称</div>
                <ul class="clearfix fl"  style="width: 100%;">
                    <textarea id="content" lay-verify="content"  name="content" style="display: none;">${eq.content}</textarea>
                </ul>
                <#--            选择题-->
                <div id="dx">
                    <div class="bold">选项(从选项中选择一个作为答案)</div>
                    <div id="dxs">
                        <#list exq as vo>
                            <#if "${vo.isRight}"=="1">
                                <ul class="clearfix fl dx"  style="width: 100%;">
                                    <input type="radio" name="exDxList[0].isRight" style="display: none;" checked="checked" class="fl h30 w25 doBestInput" value="${vo.answerContent}">

                                    <span>${vo.answerContent}</span>、<span>答案</span>

                                    <textarea id="dx${vo.serial}" lay-verify="content" class="dodx" name="exDxList[${vo.serial}].answerAnalysis">${vo.answerAnalysis}</textarea><input type="hidden" class='dxyc' name="exDxList[${vo.serial}].answerContent" value="${vo.answerContent}">
                                </ul>
                            <#else >
                                <ul class="clearfix fl dx"  style="width: 100%;">
                                    <input type="radio" name="exDxList[0].isRight" style="display: none;"  class="fl h30 w25 doBestInput" value="${vo.answerContent}">
                                    <span>${vo.answerContent}</span>、<span>答案</span>
                                    <textarea id="dx${vo.serial}" lay-verify="content" class="dodx" name="exDxList[${vo.serial}].answerAnalysis">${vo.answerAnalysis}</textarea><input type="hidden" class='dxyc' name="exDxList[${vo.serial}].answerContent" value="${vo.answerContent}">
                                </ul>
                            </#if>
                            <input type="hidden" name="exDxList[${vo.serial}].quAnswerId" value="${vo.quAnswerId}">
                        </#list>
                    </div>
                </div>
                <#--            多选题-->
                <div id="duox">
                    <div class="bold">选项(从选项中选择一个作为答案)</div>
                    <div id="duoxs">
                        <#list exq as vo>
                            <#if "${vo.isRight}"=="1">
                                <ul class="clearfix fl duox"  style="width: 100%;">
                                    <span style="float: left"  >${vo.answerContent}</span><input type="checkbox" name="exDuoxList[${vo.serial}].isRight" style="display: none;" checked="checked" class="fl h30 w25 doBestInput" value="${vo.answerContent}"><span>答案</span>
                                    <textarea id="duox${vo.serial}" class="doduox" lay-verify="content" name="exDuoxList[${vo.serial}].answerAnalysis">${vo.answerAnalysis}</textarea><input type="hidden" class='duoxyc' name="exDuoxList[${vo.serial}].answerContent" value="${vo.answerContent}">
                                </ul>
                            <#else >
                                <ul class="clearfix fl duox"  style="width: 100%;">
                                    <span style="float: left"  >${vo.answerContent}</span><input type="checkbox" name="exDuoxList[${vo.serial}].isRight" style="display: none;"  class="fl h30 w25 doBestInput" value="${vo.answerContent}"><span>答案</span>
                                    <textarea id="duox${vo.serial}" class="doduox" lay-verify="content" name="exDuoxList[${vo.serial}].answerAnalysis">${vo.answerAnalysis}</textarea><input type="hidden" class='duoxyc' name="exDuoxList[${vo.serial}].answerContent" value="${vo.answerContent}">
                                </ul>
                            </#if>
                            <input type="hidden" name="exDuoxList[${vo.serial}].quAnswerId" value="${vo.quAnswerId}">
                        </#list>
                    </div>
                </div>
                <#--			判断题-->
                <div id="pd">
                    <#list exq as vo>
                        <input type="hidden" name="exPdList[${vo.serial}].quAnswerId" value="${vo.quAnswerId}">
                    </#list>
                    <div class="bold">选项(从选项中选择一个作为答案)</div>
                    <ul class="clearfix fl"  style="width: 100%;">
                        <#list exq as vo>
                            <#if  "${vo.isRight}"=="1" >
                                <input type="radio" name="exPdList[0].isRight" value="${vo.answerContent}" title="${vo.answerContent}"  checked="checked">
                            <#else>
                                <input type="radio" name="exPdList[0].isRight" value="${vo.answerContent}" title="${vo.answerContent}">
                            </#if>
                            <input type="hidden" name="exPdList[0].quAnswerId" value="${vo.quAnswerId}">
                        </#list>
                        <input type="text" name="exPdList[0].answerContent" value="√" style="display:none">
                        <input type="text" name="exPdList[1].answerContent" value="×" style="display:none">
                    </ul>
                </div>
                <#--			填空题-->
                <div id="tk">
                    <div class="bold">答案</div>
                    <#list exq as vo>
                        <ul class="clearfix fl tk"  style="width: 100%;">
                            <label class="fl w90" style="float: left" >${vo.answerAnalysis}</label><input type="text" class="tiankong" name="exTkList[${vo.serial}].answerContent" value="${vo.answerContent}" placeholder="请输入内容">
                            <input type="hidden" class='tihao' name="exTkList[${vo.serial}].quAnswerId" value="${vo.quAnswerId}">
                            <img style="background-color: #3e7ce7" src="${re.contextPath}/plugin/common/images/30@2x.png" onclick="del(this)" alt="" class="">
                        </ul>
                    </#list>
                    <div id="tks">
                    </div>
                </div>
                <#--			问答题-->
                <div id="wd">
                    <#list exq as vo>
                        <input type="hidden" name="exWdList[0].quAnswerId" value="${vo.quAnswerId}">
                    </#list>
                    <div class="bold">问题答案</div>
                    <ul class="clearfix fl"  style="width: 100%;">
                        <textarea id="wdt" lay-verify="content" name = "exWdList[0].answerContent" >${exq[0].answerContent}</textarea>

                    </ul>
                </div>
                <div class="bold">解析</div>
                <ul class="clearfix fl"  style="width: 100%;">
                    <textarea id="analysis" lay-verify="content" name="analysis" style="display: none;">${eq.analysis}</textarea>
                </ul>
                <div class="releaseBtn center">
                </div>
            </div>
        </form>
    </div>
</div>
<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/tabs.js"></script>
<script type="text/javascript">
    var layer;
    var form;
    var table = null;
    var tableIns = null;
    var layedit;
    var letter = new Array("A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z");
    //注意进度条依赖 element 模块，否则无法进行正常渲染和功能性操作
    var element = "";
    layui.use(['element','laydate','layedit','form'], function () {
        element = layui.element;
        form = layui.form;
        layedit = layui.layedit;
        var content=layedit.build('content'); //建立编辑器
        var analysis=layedit.build('analysis'); //建立编辑器
        var wdt= layedit.build('wdt');
        window.check = function (bjq) {
            layedit.build(bjq);
        };

        form.verify({
            //content富文本域中的lay-verify值
            content: function(value) {
                layedit.sync(wdt);
                //单选和多选的富文本
                var index=$("textarea").length;
                if(index>3){
                    for(var i=4;i<=index;i++){
                        layedit.sync(i);
                    }
                }
            }
        });
        //保存
        form.on('submit(save)', function(data){
            var datas=data.field;
            datas.content=layedit.getContent(content);
            datas.analysis=layedit.getContent(analysis);
            datas.status ='001';
            layerAjaxGet("/ex/question/insertSt",data.field,'',function (d) {
                if(d.flag){
                    layer.msg("保存成功！",{icon:1});
                    setTimeout(function () {
                        window.parent._delTab('cf8c85d3685a48abb23a4104ef32197c');
                        window.parent._delTab('5253b2f369364ceca7dbca94a85b68ca');
                        window.parent._showtab('5253b2f369364ceca7dbca94a85b68ca', '试题库', '/ex/question/stkIndex');
                    },1000)
                }else{
                    layer.msg("保存失败！",{icon:2});return false;
                }
            })
            return false;
        });
        //提交
        form.on('submit(submit)', function(data){
            var datas=data.field;
            datas.content=layedit.getContent(analysis);
            datas.analysis=layedit.getContent(analysis);
            datas.status ='002';
            layerAjaxGet("/ex/question/insertSt",data.field,'',function (d) {
                if(d.flag){
                    layer.msg("提交成功！",{icon:1});
                    setTimeout(function () {
                        window.parent._delTab('cf8c85d3685a48abb23a4104ef32197c');
                        window.parent._delTab('5253b2f369364ceca7dbca94a85b68ca');
                        window.parent._showtab('5253b2f369364ceca7dbca94a85b68ca', '试题库', '/ex/question/stkIndex');
                    },1000)
                }else{
                    layer.msg("提交失败！",{icon:2});return false;
                }
            })
            return false;
        });
        //保存并添加
        form.on('submit(saves)', function(data){
            var datas=data.field;
            datas.content=layedit.getContent(content);
            datas.analysis=layedit.getContent(analysis);
            datas.status ='001';
            layerAjaxGet("/ex/question/insertSt",data.field,'',function (d) {
                if(d.flag){
                    layer.msg("保存成功！",{icon:1});
                    setTimeout(function () {
                        window.location.reload();
                    },1000)
                }else{
                    layer.msg("保存失败！",{icon:2});return false;
                }
            })
            return false;
        });
    });
    //取消按钮
    $('.close').click(function () {
        var quId=$("#quId").val();
        window.parent._delTab(quId);
        window.parent._delTab('5253b2f369364ceca7dbca94a85b68ca');
        setTimeout(function () {
            window.parent._showtab('', '试题库', '/ex/question/stkIndex');
        },1)
    });
    $(function(){
        var code = ${eq.quType};
        lxChange(code);
    })
    //选择试题类型进行切换数据
    function lxChange(code){
        if(code=='001'){
            $("#dx").show();
            $("#wd").hide();
            $("#pd").hide();
            $("#tk").hide();
            $("#duox").hide();
            var index=${index};
            var a=0
            //为每个选项生成富文本
            for(var i=0;i<index;i++){
                layui.use(['layedit'], function (){
                    var layedit=layui.layedit;
                    layedit.build('dx'+a);
                    a++;
                })
            }
        }
        if(code=='002'){
            $("#duox").show();
            $("#wd").hide();
            $("#dx").hide();
            $("#tk").hide();
            $("#pd").hide();
            var index=${index};
            var a=0
            //为每个选项生成富文本
            for(var i=0;i<index;i++){
                layui.use(['layedit'], function (){
                    var layedit=layui.layedit;
                    layedit.build('duox'+a);
                    a++;
                })
            }

        }
        if(code=='003'){
            $("#pd").show();
            $("#wd").hide();
            $("#dx").hide();
            $("#tk").hide();
            $("#duox").hide();

        }
        if(code=='004'){
            $("#tk").show();
            $("#pd").hide();
            $("#wd").hide();
            $("#dx").hide();
            $("#duox").hide();

        }
        if(code=='005'){
            $("#wd").show();
            $("#dx").hide();
            $("#tk").hide();
            $("#pd").hide();
            $("#duox").hide();
        }

    }

    //增加单选题
    function addDx(){

        var index=$(".dx").length;
        var dx=$("<ul class=\"clearfix fl dx\"  style=\"width: 100%;position: relative\">\n" +
            "\t\t\t\t\t<span style=\"float: left\"  >"+letter[index]+"</span><input type=\"radio\" name=\"exDxList[0].isRight\" style=\"display: none;\"  class=\"fl h30 w25 doBestInput\" value=\""+letter[index]+"\"><span class=\"da\">答案</span>\n" +
            "\t\t\t\t\t<textarea id=\"dx"+index+"\" class=\"dodx\" lay-verify=\"content\" name=\"exDxList["+index+"].answerAnalysis\"></textarea><input type=\"hidden\" class='dxyc' name=\"exDxList["+index+"].answerContent\" value=\""+letter[index]+"\">\n" +
            "\t\t\t\t</ul>");
        var b=$("<img src=\"${re.contextPath}/plugin/common/images/30@2x.png\"  style=\"position:absolute;top:35px;right:-25px;background:#3e7ce7\"  onclick=\"delDx(this)\" alt=\"\" class=\"\">");
        b.click(delDx);
        var bjq="dx"+index
        //延迟让标签先生成
        setTimeout(function(){
            dx.append(b)
            check(bjq);
        },1);
        $("#dxs").append(dx);

        form.render();
    }
    function delDx(Object){
        $(this).parent().remove();
        if ($(this).parent().length > 0) {
            var ssses = $(".dodx");
            if (ssses.length > 0) {
                formatDXInd();
            }
        }
    }
    //删除后剩余重新排序
    function formatDXInd() {
        var ssses = $(".dodx");
        $.each(ssses, function (ind, obj) {
            var oldAttrName = $(obj).attr('name');
            if (oldAttrName) {
                var front = oldAttrName.substring(0, oldAttrName.indexOf("[") + 1);
                var back = oldAttrName.substring(oldAttrName.indexOf("]"), oldAttrName.length);
                var newName = front + (ind) + back;
                $(obj).attr('name', newName);
                $(obj).attr('id', "dx"+ind);
                $(obj).prev().prev().attr('value',letter[(ind)]);
                $(obj).prev().prev().prev().text(letter[(ind)]);
            }
        })
        //遍历隐藏框
        var ssse = $(".dxyc");
        $.each(ssse, function (ind, obj) {
            var oldAttrName = $(obj).attr('name');
            if (oldAttrName) {
                var front = oldAttrName.substring(0, oldAttrName.indexOf("[") + 1);
                var back = oldAttrName.substring(oldAttrName.indexOf("]"), oldAttrName.length);
                var newName = front + (ind) + back;
                $(obj).attr('name', newName);
                $(obj).attr('value', letter[ind]);

            }
        })
    }
    //增加多选题
    function addDuox(){
        var index=$(".duox").length;
        var duox=$("<ul class=\"clearfix fl duox\"  style=\"width: 100%;position: relative\">\n" +
            "\t\t\t\t\t<span style=\"float: left\" class=\"answerContent\">"+letter[index]+"</span><input type=\"checkbox\" name=\"exDuoxList["+index+"].isRight\" style=\"display: none;\" class=\"fl h30 w25 doBestInput\" value=\""+letter[index]+"\"><span>答案</span>\n" +
            "\t\t\t\t\t<textarea id=\"duox"+index+"\" class=\"doduox\" lay-verify=\"content\" style=\"display: none;\" name=\"exDuoxList["+index+"].answerAnalysis\"></textarea><input type=\"hidden\" class='duoxyc' name=\"exDuoxList["+index+"].answerContent\" value=\""+letter[index]+"\">\n" +
            "\t\t\t\t</ul>");
        var b=$("<img src=\"${re.contextPath}/plugin/common/images/30@2x.png\"  style=\"position:absolute;top:35px;right:-25px;background:#3e7ce7\"  onclick=\"delDx(this)\" alt=\"\" class=\"\">");
        b.click(delDuox);
        var bjq="duox"+index
        //延迟让标签先生成
        setTimeout(function(){
            duox.append(b)
            check(bjq);
        },1);
        $("#duoxs").append(duox);

        form.render();
    }
    function delDuox(Object){
        $(this).parent().remove();
        if ($(this).parent().length > 0) {
            var ssses =  $(".doduox");
            if (ssses.length > 0) {
                formatDUOXInd();
            }
        }
    }
    //删除后剩余重新排序
    function formatDUOXInd() {
        var ssses = $(".doduox");
        $.each(ssses, function (ind, obj) {
            var oldAttrName = $(obj).attr('name');
            var oldAttrNames = $(obj).prev().prev().attr('name');
            if (oldAttrName) {
                var front = oldAttrName.substring(0, oldAttrName.indexOf("[") + 1);
                var back = oldAttrName.substring(oldAttrName.indexOf("]"), oldAttrName.length);
                var newName = front + (ind) + back;
                $(obj).attr('name', newName);
                $(obj).attr('id', "dx"+ind);
                $(obj).prev().prev().attr('value',letter[(ind)]);
                $(obj).prev().prev().prev().text(letter[(ind)]);
            }
            if (oldAttrNames) {
                var front = oldAttrNames.substring(0, oldAttrNames.indexOf("[") + 1);
                var back = oldAttrNames.substring(oldAttrNames.indexOf("]"), oldAttrNames.length);
                var newName = front + (ind) + back;
                $(obj).prev().prev().attr('name', newName);
            }
        })
        //遍历隐藏框
        var ssse = $(".duoxyc");
        $.each(ssse, function (ind, obj) {
            var oldAttrName = $(obj).attr('name');
            if (oldAttrName) {
                var front = oldAttrName.substring(0, oldAttrName.indexOf("[") + 1);
                var back = oldAttrName.substring(oldAttrName.indexOf("]"), oldAttrName.length);
                var newName = front + (ind) + back;
                $(obj).attr('name', newName);
                $(obj).attr('value', letter[ind]);

            }
        })
    }
    //增加填空题
    function addTk(){
        var index=$(".tk").length;
        var i=$(".tk").length-1;
        var tk=$("<ul class=\"clearfix fl tk\"  style=\"width: 100%;\">\n" +
            "\t\t\t\t\t\t<label class=\"fl w90\" style=\"float: left\" >填空"+(index+1)+"</label><input type=\"text\" class=\"tiankong\" name=\"exTkList["+(i+1)+"].answerContent\" placeholder=\"请输入内容\">" +
            "<input type=\"hidden\" class='tihao' name=\"exTkList["+(i+1)+"].answerAnalysis\" value=\"填空"+(index+1)+"\"></ul>");

        var b=$("<img src=\"${re.contextPath}/plugin/common/images/31@2x.png\" onclick=\"del(this)\" alt=\"\" class=\"\">");
        b.click(del);
        tk.append(b)
        $("#tks").append(tk);

        form.render();
    }
    function del(Object){
        $(this).parent().remove();
        if ($(this).parent().length > 0) {
            var ssses = $(".tiankong");
            if (ssses.length > 0) {
                formatFBInd();
            }
        }
    }
    //删除后剩余重新排序
    function formatFBInd() {
        var ssses = $(".tiankong");
        $.each(ssses, function (ind, obj) {
            var oldAttrName = $(obj).attr('name');
            if (oldAttrName) {
                var front = oldAttrName.substring(0, oldAttrName.indexOf("[") + 1);
                var back = oldAttrName.substring(oldAttrName.indexOf("]"), oldAttrName.length);
                var newName = front + (ind) + back;
                $(obj).attr('name', newName);
                //更改 分包编号x
                $(obj).prev().html("填空" + (ind * 1 + 1));
            }
        })
        //遍历隐藏框
        var ssse = $(".tihao");
        $.each(ssse, function (ind, obj) {
            var oldAttrName = $(obj).attr('name');
            if (oldAttrName) {
                var front = oldAttrName.substring(0, oldAttrName.indexOf("[") + 1);
                var back = oldAttrName.substring(oldAttrName.indexOf("]"), oldAttrName.length);
                var newName = front + (ind) + back;
                $(obj).attr('name', newName);
                $(obj).attr('value', "填空"+(ind * 1 + 1));

            }
        })
    }
</script>
</body>
</html>